<template>
	<view class="mfbs-main-content" style="background-color: rgb(249, 246, 220);">
		<toTop :scrollTop='scrollTop' @toTop='toTop'></toTop>
		<template v-if="title==''||result_list.length==0">
			<view class="load">
				<u-loading-page :loading="true"></u-loading-page>
			</view>
		</template>
		<template v-else>
			<mfbsHead :backColor='backColor' :title='title' :isShow='isShow' :img_url='img_url'></mfbsHead>
			<view class="app-content">
				<view class="app-content-header">
					<block v-for="(item,index) in list" :key="index">
						<view class="head-item">
							<image :src="item.data._hotspot.image" mode="widthFix"></image>
						</view>
						<template v-if="index==1">
							<view class="action-box">
								<image
									src="https://img.youpin.mi-img.com/jianyu/fe42e9a8_2082_4ccb_9c3c_6ff138724ab0.png@base@tag=imgScale&h=175&m=1&q=80&w=751">
								</image>
							</view>
						</template>
						<template v-if="index==2 && result_list.length!=0">
							<twoRow :list="result_list[0].list" backColor="rgb(249, 246, 220)"></twoRow>
						</template>
						<template v-if="index==3&& result_list.length!=0">
							<oneRow :list="result_list[1].list"></oneRow>
						</template>
						<template v-if="index==4 && goodList.length!=0">
							<twoRow :list="goodList" backColor="rgb(249, 246, 220)"></twoRow>
						</template>
					</block>
				</view>
			</view>
		</template>
	</view>
</template>

<script>
	import mfbsHead from '../../components/mfbs-header/mfbs-header.vue'
	import toTop from '../../components/getTop/getTop.vue'
	import twoRow from '../../components/two-row-detail/two-row-detail.vue'
	import oneRow from '../../components/one-row-detail/one-row-detail.vue'
	let query_1 = {
		"query_list": [{
			"resolver": "shop-coupon-award-pool",
			"sign": "afb8e6d1c405565d4e95e437fd287784",
			"parameter": "{\"pool_id\":\"64a76fa519fe8a574f88c086\",\"scene_code\":\"mishop\"}",
			"variable": {}
		}, {
			"resolver": "mishop-grating",
			"sign": "53d54d953bed43c47872a7778f041b61",
			"parameter": "{\"plan_ids\":[1011094],\"manual_sort\":\"artificial_weight\",\"selectImg\":\"img800s\",\"labels_filter\":\"\",\"need_all\":false,\"limit\":2,\"column_number\":2}",
			"variable": {}
		}, {
			"resolver": "mishop-grating",
			"sign": "2241d1b2b5e6c888d57ba0c18eb1471f",
			"parameter": "{\"plan_ids\":[1011096],\"manual_sort\":\"artificial_weight\",\"selectImg\":\"img800s\",\"labels_filter\":\"\",\"need_all\":false,\"limit\":3,\"column_number\":1}",
			"variable": {}
		}]
	}
	let query_2 = {
		"query_list": [{
			"resolver": "mishop-grating",
			"sign": "59827f4ca271695fb9967c9ec005f357",
			"parameter": "{\"plan_ids\":[1011093],\"manual_sort\":\"artificial_weight\",\"selectImg\":\"img800s\",\"labels_filter\":\"\",\"need_all\":false,\"limit\":6,\"column_number\":2}",
			"variable": {}
		}, {
			"resolver": "mishop-grating",
			"sign": "ae08966be6540f3900172307c6221f33",
			"parameter": "{\"plan_ids\":[1011095],\"manual_sort\":\"artificial_weight\",\"selectImg\":\"img800s\",\"labels_filter\":\"\",\"need_all\":false,\"limit\":30,\"column_number\":2}",
			"variable": {}
		}]
	}
	export default {
		components: {
			mfbsHead,
			toTop,
			twoRow,
			oneRow
		},
		onPageScroll(res) {
			this.scrollTop = res.scrollTop
			if (res.scrollTop >= 100) {
				this.isShow = true
				this.img_url = 'left_b'
				this.backColor = 'rgb(244, 244, 244)'
			} else {
				this.backColor = 'transparent'
				this.img_url = 'left'
				this.isShow = false
			}
		},
		data() {
			return {
				img_url: 'left',
				isShow: false,
				scrollTop: 0,
				backColor: 'transparent',
				title: '',
				floorList: [],
				list: [],
				result_list: [],
				goodList: ''
			};
		},
		methods: {
			toTop() {
				uni.pageScrollTo({
					duration: 0,
					scrollTop: 0,
				})
			},
			getVenuePageList() {
				this.$request.get('/getVenuePageList', {
					page_id: '12103',
					sign: 'fddbe507a73b2ceb9092a04f6c524a27'
				}).then((res) => {
					this.floorList = res.data.data.floors
					this.title = res.data.data.title
					let list = []
					this.floorList.forEach(item => {
						if (item.module_key == "fusion_img_link_map") {
							list.push(item)
						}
					})
					this.list = list
				}).catch(e => {
					console.log('错误了:', e)
				})
			},
			getVenueBatchList(type) {
				let queryData
				if (type == 1) {
					queryData = query_1
				} else if (type == 2) {
					queryData = query_2
				}
				this.$request.get('/getVenueBatchList', {
					page_id: '12103',
					queryData: queryData,
					sign: 'fddbe507a73b2ceb9092a04f6c524a27'
				}).then((res) => {
					if (type == 1) {
						let list = res.data.data.result_list
						list.forEach(item => {
							if (item.list) {
								this.result_list.push(item)
							}
						})
					} else if (type == 2) {
						let list = []
						res.data.data.result_list.forEach(item => {
							list = list.concat(item.list)
						})
						this.goodList = list
					}

				}).catch(e => {
					console.log('错误了:', e)
				})
			},
		},
		onLoad() {
			this.getVenuePageList()
			this.getVenueBatchList(1)
			this.getVenueBatchList(2)
		}
	}
</script>

<style lang="scss">
	.mfbs-main-content {
		view {
			line-height: 1.15;
			font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
		}

		.action-box {
			width: 100%;
			height: 1.67rem;

			image {
				width: 100%;
				height: 1.67rem;
			}
		}

		.head-item {
			image {
				width: 100%;
			}
		}



	}
</style>